<%@ page import="dao.Dao" %>
<%@ page import="domain.Order_Good" %><%--
  Created by IntelliJ IDEA.
  User: wangh
  Date: 2020/12/27
  Time: 15:43
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>修改订单</title>

    <!-- 1. 导入CSS的全局样式 -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- 2. jQuery导入，建议使用1.9以上的版本 -->
    <script src="js/jquery-3.3.1.min.js"></script>
    <!-- 3. 导入bootstrap的js文件 -->
    <script src="js/bootstrap.min.js"></script>
    <script>
        function checkForm() {
            let checkAddress1 = checkAddress();
            let checkReceiveName1 = checkReceiveName();
            let checkTele1 = checkTele();
            console.log(checkAddress1);
            console.log(checkReceiveName1);
            console.log(checkTele1);
            return checkAddress1 && checkReceiveName1 && checkTele1;
        }

        function checkAddress() {
            let address = document.getElementById('address');
            let addressErr = document.getElementById('addressErr');
            if (address.value.length == 0) {
                addressErr.innerHTML = "收货地址不能为空"
                addressErr.className = "error"
                return false;
            } else {
                addressErr.innerHTML = "OK"
                addressErr.className = "success";
                return true;
            }
        }

        function checkReceiveName() {
            let receivename = document.getElementById('receivename');
            let receivenameErr = document.getElementById('receivenameErr');
            if (receivename.value.length == 0) {
                receivenameErr.innerHTML = "收货人不能为空"
                receivenameErr.className = "error"
                return false;
            } else {
                receivenameErr.innerHTML = "OK"
                receivenameErr.className = "success";
                return true;
            }
        }

        function checkTele() {
            let tele = document.getElementById('tele');
            let teleErr = document.getElementById('teleErr');
            let pattern = /^1[34578]\d{9}$/; //验证手机号正则表达式
            if (!pattern.test(tele.value)) {
                teleErr.innerHTML = "电话号码不合规范"
                teleErr.className = "error"
                return false;
            } else if (tele.value.length == 0) {
                teleErr.innerHTML = "电话号码不能为空"
                teleErr.className = "error"
                return false;
            } else {
                teleErr.innerHTML = "OK"
                teleErr.className = "success";
                return true;
            }
        }
    </script>
</head>
<body style="background-color: #F2F2F2">
<%
    request.setCharacterEncoding("utf-8");
    String orderid = request.getParameter("orderid");
    Dao dao = new Dao();
    Order_Good orderByOrderId = dao.findOrderByOrderId(orderid);
    request.setAttribute("orderByOrderId", orderByOrderId);
%>
<div class="logoBar"
     style="height: 75px;background: #1d7ad9;font-size: 35px;font-weight: bolder;padding-left: 100px;padding-top: 12px;color: white;">
    电脑销售管理后台
</div>
<div class="container" style="width: 400px;background-color: #ffffff;margin-top: 20px;border-radius: 10px;">
    <h3 style="text-align: center;">订单信息</h3>
    <form action="${pageContext.request.contextPath}/updateOrderInfoServlet" method="post" onSubmit="return checkForm()" id="form">
        <div class="form-group">
            <label for="orderid">订单号：</label>
            <input type="text" name="orderid" class="form-control" id="orderid"
                   value="${orderByOrderId.orderid}" readonly="readonly"/>
        </div>
        <div class="form-group">
            <label for="cname">商品名称：</label>
            <input type="text" name="cname" class="form-control" id="cname"
                   value="${orderByOrderId.cname}" readonly="readonly"/>
        </div>
        <div class="form-group">
            <label for="snumber">商品数量：</label>
            <input type="text" name="snumber" class="form-control" id="snumber"
                   value="${orderByOrderId.snumber}" readonly="readonly"/>
        </div>
        <div class="form-group">
            <label for="ordertotal">商品总价：</label>
            <input type="text" name="ordertotal" class="form-control" id="ordertotal"
                   value="${orderByOrderId.ordertotal}" readonly="readonly"/>
        </div>
        <div class="form-group">
            <label for="paymode">付款方式：</label>
            <input type="text" name="paymode" class="form-control" id="paymode"
                   value="${orderByOrderId.paymode}" readonly="readonly"/>
        </div>
        <div class="form-group">
            <label for="orderstate">订单状态：</label>
            <input type="text" name="orderstate" class="form-control" id="orderstate"
                   value="${orderByOrderId.orderstate}" readonly="readonly"/>
        </div>
        <div class="form-group">
            <label for="address">收获地址：</label>
            <input type="text" name="address" class="form-control" id="address"
                   value="${orderByOrderId.address}" placeholder="请输入收货地址" oninput="checkAddress()"/>
            <span id="addressErr"></span>
        </div>
        <div class="form-group">
            <label for="receivename">收货人：</label>
            <input type="text" name="receivename" class="form-control" id="receivename"
                   value="${orderByOrderId.receivename}" placeholder="请输入收货人姓名" oninput="checkReceiveName()"/>
            <span id="receivenameErr"></span>
        </div>
        <div class="form-group">
            <label for="tele">电话号码：</label>
            <input type="text" name="tele" class="form-control" id="tele"
                   value="${orderByOrderId.tele}" placeholder="请输入联系方式" oninput="checkTele()"/>
            <span id="teleErr"></span>
        </div>
        <div class="form-group" style="text-align: center;margin-top: 10px;">
            <input class="btn btn btn-primary" type="submit" value="修改订单">
        </div>
    </form>
    <div class="alert alert-warning alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
                aria-hidden="true">&times;</span></button>
        <strong>提示信息:</strong>${updateInfo}
    </div>
</div>
</body>
</html>
